<style>
    header{
        padding: 0 10% ;
    }
    .navUl li{
        float: left;
        list-style: none;
        padding: 10px;
        margin: 0 20px;
    }
    .userInfo{
        float: left;
        margin: 0 40px;
    }
    .userInfo span{
        display: block;
    }
    .clear::after{
        content: '';
        display: block;
        clear: both;
    }
    .outLogin{
        display: inline-block;
        float: right;
    }

</style>
<header class="clear">
    <div class="userInfo">
        <%if(user.user!=undefined){%><span>欢迎 <%=user.user%></span><%
        }
        else{
        location.href='/login.html'
        }
        %>
    </div>

<ul class="navUl">
    <li><a href="./demo.html">产品罗列页</a></li>
    <li><a href="./index.html">首页</a></li>
</ul>
    <button class="outLogin">退出登录</button>


</header>

<script src="../../Jquery/JQuery.js"></script>
<script>
    $('.outLogin').click(function () {

            $.ajax({
                url:'/outLogin',
                method:'get',
                success(data){
                    if (data.code===200){
                        location.href='/login.html'
                    }
                }

            })


    })
</script>